<template>
  <!-- 合同详情 -->
  <el-dialog
    v-el-drag-dialog
    title="合同详情"
    :visible.sync="visible"
    width="700px"
    append-to-body
    @close="reset"
  >
    <div slot="footer" class="dialog-footer">
      <el-button @click="reset"> 关闭 </el-button>
      <el-button type="primary" @click="success"> 打印 </el-button>
    </div>
    <div v-html="content" />
  </el-dialog>
</template>

<script>
  import { queryEableContractTempWin } from '@/api'

  export default {
    name: 'pact-info',
    components: {},
    data() {
      return {
        visible: false,
        content: ''
      }
    },
    methods: {
      async open(row) {
        const res = await queryEableContractTempWin({
          templateId: row.templateId,
          contractId: 35
        })
        this.initContent(res.data.ck, res.data.content, res.data.contentValue)
        return new Promise((resolve) => {
          this.resolve = resolve
          this.visible = true
        })
      },
      initContent(ck, content, contentValue) {
        if (content === '') return
        const options = content.match(/\{(.+?)\}/g)
        const check = JSON.parse(contentValue)
        let item = content
        for (const i in options) {
          const contentItem = options[i]
          if (ck === 1) {
            if (Number(i) < 9) {
              const contentItemNumber = Number(contentItem.substring(1, 2))
              for (const key in check) {
                if (contentItemNumber === check[key].id && check[key].type === 5) {
                  item = item.replace(
                    options[i],
                    '<input type="checkbox"  disabled = "false" style="zoom:190%;" >'
                  )
                }
              }
              item = item.replace(
                options[i],
                options[i].substring(2, options[i].length - 1) + '&nbsp;'
              )
            } else {
              for (const key in check) {
                if (Number(contentItem.substring(1, 3)) === check[key].id && check[key].type === 5) {
                  item = item.replace(
                    options[i],
                    '<input type="checkbox"  disabled = "false" style="zoom:190%;" >'
                  )
                }
              }
              item = item.replace(
                options[i],
                options[i].substring(3, options[i].length - 1) + '&nbsp;'
              )
            }
          } else {
            for (const key in check) {
              if (Number(i) < 9) {
                const contentItemNumber = Number(contentItem.substring(1, 2))
                if (contentItemNumber === check[key].id && check[key].type === 5) {
                  if (check[key].checked > 0) {
                    item = item.replace(
                      options[i],
                      '<input type="checkbox" checked disabled = "false" style="zoom:190%;" >'
                    )
                  } else {
                    item = item.replace(
                      options[i],
                      '<input type="checkbox"  disabled = "false" style="zoom:190%;" >'
                    )
                  }
                }
                if (contentItemNumber === check[key].id) {
                  if (check[key].type === 4) {
                    item = item.replace(
                      options[i],
                      '<img style="max-width: 120px;max-height: 120px;margin-top: -120px;margin-left: -80px" src=' +
                        check[key].value +
                        '>' +
                        '&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;'
                    )
                  } else {
                    item = item.replaceAll(options[i], check[key].value)
                  }
                }
              } else {
                const contentItemNumber = Number(contentItem.substring(1, 3))
                if (contentItemNumber === check[key].id && check[key].type === 5) {
                  if (check[key].checked > 0) {
                    item = item.replace(
                      options[i],
                      '<input type="checkbox" checked disabled = "false" style="zoom:190%;" >'
                    )
                  } else {
                    item = item.replace(
                      options[i],
                      '<input type="checkbox"  disabled = "false" style="zoom:190%;" >'
                    )
                  }
                  item = item.replace(options[i], check[key].value)
                }
                if (contentItemNumber === check[key].id) {
                  if (check[key].type === 4) {
                    item = item.replace(
                      options[i],
                      '<img style="max-width: 120px;max-height: 120px;margin-top: -120px;margin-left: -80px" src=' +
                        check[key].value +
                        '>' +
                        '&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;'
                    )
                  } else {
                    item = item.replace(options[i], check[key].value)
                  }
                }
              }
            }
          }
        }
        this.content = item
      },
      success() {
        const pwin = window.open('', 'print')
        pwin.document.write(this.content)
        pwin.document.close()
        pwin.print()
      },
      // 详情
      reset() {
        this.content = ''
        this.visible = false
      }
    }
  }
</script>

<style lang="scss" scoped></style>
